import { useUserStore } from '@/stores/user'
import { createRouter, createWebHistory } from 'vue-router'


const router = createRouter({
  // import.meta.env.BASE_URL 是根本路径 这个是设置默认显示的路径
  history: createWebHistory(import.meta.env.BASE_URL),
  routes: [{
    // 登录页面
    path: '/login',
    // 采用 组件懒加载 提高首屏加载的效率
    component: () => import('@/views/Login/index.vue')
  }, {
    // 布局页面
    path: '/',
    component: () => import('@/views/Layout/index.vue'),
    // 重定向到数据面板
    redirect: '/article',
    // 路由嵌套
    children: [{
      // 文章页面
      path: 'article',
      component: () => import('@/views/Article/index.vue')
    }, {
      // 数据面板
      path: 'databoard',
      component: () => import('@/views/DataBoard/index.vue')
    }]
  }],
})

// 路由白名单
const whiteList = ['/login']

// 路由前置守卫
router.beforeEach((to, from) => {
  const userStore = useUserStore()
  if (userStore.token) {
    // 有 token 
    if (to.path === '/login') {
      // 但是去登录页面 那么就返回到首页
      return '/'
    } else {
      return true
    }
  } else {
    // 没有 token
    if (whiteList.includes(to.path)) {
      // 白名单包含 to.path 那么就放行
      return true
    } else {
      // 不包含 那么就跳转到登录页 redirectUrl 是用来登陆后可以重新跳转到原来的路径
      return `/login?redirectUrl=${to.path}`
    }
  }
})


export default router
